<template>
  <el-form ref="form" :rules="rules" :model="form" label-width="120px">
    <el-form-item prop="currentBasicSalary" label="当前基本工资">
      <el-input v-model.number="form.currentBasicSalary" placeholder="当前基本工资" width="200px" />
    </el-form-item>
    <el-form-item prop="currentPostWage" label="当前岗位工资">
      <el-input v-model.number="form.currentPostWage" placeholder="当前岗位工资" />
    </el-form-item>
    <el-form-item label="当前工资合计">
      <el-input v-model="fixedBasicSalary" disabled />
    </el-form-item>
    <el-form-item prop="correctionOfBasicWages" label="转正基本工资">
      <el-input v-model.number="form.correctionOfBasicWages" placeholder="转正基本工资" />
    </el-form-item>
    <el-form-item prop="turnToPostWages" label="转正岗位工资">
      <el-input v-model.number="form.turnToPostWages" placeholder="转正岗位工资" />
    </el-form-item>
    <el-form-item label="转正工资合计">
      <el-input v-model="fixedPostWage" disabled />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="btnOk">确认</el-button>
      <el-button @click="btnCancel">关闭</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import { initSalarys } from '@/api/salarys'
export default {
  props: {
    userId: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      form: {
        currentBasicSalary: '',
        currentPostWage: '',
        correctionOfBasicWages: '',
        turnToPostWages: ''
      },
      rules: {
        currentBasicSalary: [
          { type: 'number', trigger: 'blur', message: '此项必须得为数字' },
          { required: true, trigger: 'blur', message: '此项不能为空' }
        ],
        currentPostWage: [
          { type: 'number', trigger: 'blur', message: '此项必须得为数字' },
          { required: true, trigger: 'blur', message: '此项不能为空' }
        ],
        correctionOfBasicWages: [
          { type: 'number', trigger: 'blur', message: '此项必须得为数字' },
          { required: true, trigger: 'blur', message: '此项不能为空' }
        ],
        turnToPostWages: [
          { type: 'number', trigger: 'blur', message: '此项必须得为数字' },
          { required: true, trigger: 'blur', message: '此项不能为空' }
        ]
      }
    }
  },
  computed: {
    // 当前工资合计
    fixedBasicSalary() {
      let base = 0
      let post = 0
      if (this.form.currentBasicSalary != null && typeof (this.form.currentBasicSalary) === 'number') {
        base = Number(this.form.currentBasicSalary)
      }
      if (this.form.currentPostWage != null && typeof (this.form.currentBasicSalary) === 'number') {
        post = Number(this.form.currentPostWage)
      }
      return base + post
    },
    // 转正工资合计
    fixedPostWage() {
      let base = 0
      let post = 0
      if (this.form.correctionOfBasicWages != null && typeof (this.form.currentBasicSalary) === 'number') {
        base = Number(this.form.correctionOfBasicWages)
      }
      if (this.form.turnToPostWages != null && typeof (this.form.currentBasicSalary) === 'number') {
        post = Number(this.form.turnToPostWages)
      }
      return base + post
    }

  },
  methods: {
    // 点击确定按钮 处理函数
    async btnOk() {
      try {
        // 验证表单
        await this.$refs.form.validate()
        // 往form中添加一个uesrId
        this.form.userId = this.userId
        // 发送请求
        await initSalarys(this.form)
        // 提示用户
        this.$message.success('定薪成功')
        // 关闭弹窗
        this.$emit('close')
        // 重新加载页面
        this.$emit('refresh')
      } catch (error) {
        console.log(error)
      }
    },
    // 点击取消按钮 处理函数
    btnCancel() {
      // 清空表单
      this.form = {}
      // 清空验证信息
      this.$refs.form.resetFields()
      // 关闭弹窗
      this.$emit('close')
    }
  }
}
</script>

<style>

</style>
